<template>
  <v-data-table :headers="headers" :items="desserts" sort-by="calories" class="elevation-1">
    <template v-slot:top>
      <v-toolbar flat>
        <v-toolbar-title>传票</v-toolbar-title>
        <v-divider class="mx-4" inset vertical></v-divider>
        <v-spacer></v-spacer>
        <v-dialog v-model="dialog" max-width="800px">
          <template v-slot:activator="{ on }">
            <v-btn color="primary" dark class="mb-2" v-on="on">新增传票</v-btn>
          </template>
          <v-card>
            <v-card-title>
              <span class="headline">{{ formTitle }}</span>
            </v-card-title>

            <v-card-text>
              <v-container>
                <v-row>
                  <v-col cols="12" sm="6" md="4">
                    <v-text-field v-model="editedItem.serseqn" label="流水号"></v-text-field>
                  </v-col>



                  <v-col cols="12" sm="6" md="4">
                    <v-text-field v-model="editedItem.datetrn" label="交易日期"></v-text-field>
                  </v-col>

                  <v-col cols="12" sm="6" md="4">
                    <v-text-field v-model="editedItem.datacc" label="会计日期"></v-text-field>
                  </v-col>



                   <v-col cols="12" sm="6" md="4">
                     <v-select 
                     :items="brcItems" 
                     label="交易机构" 
                     v-model="editedItem.brctran"
                      item-text="brcname"
                      item-value="brc"
                     ></v-select>
                  </v-col>

                   <v-col cols="12" sm="6" md="4">
                     <v-select 
                     :items="brcItems" 
                     label="核算机构" 
                     v-model="editedItem.brcprf"
                      item-text="brcname"
                      item-value="brc"
                     ></v-select>
                  </v-col>

                  <v-col cols="12" sm="6" md="4">
                    <v-text-field v-model="editedItem.trancode" label="交易码"></v-text-field>
                  </v-col>
                  <v-col cols="12" sm="6" md="4">
                      <v-select 
                      :items="chnelnoItems" 
                      label="法人行号" 
                      v-model="editedItem.subbnkn"
                      item-text="name"
                      item-value="attributes"
                     ></v-select>
                  </v-col>
                   <v-col cols="12" sm="6" md="4">
                      <v-select 
                      :items="moduleItems" 
                      label="所属模块" 
                      v-model="editedItem.module"
                      item-text="name"
                      item-value="attributes"
                     ></v-select>
                  </v-col>
                   <v-col cols="12" sm="6" md="4">
                    <v-text-field v-model="editedItem.subno" label="科目号"></v-text-field>
                  </v-col>
                   <v-col cols="12" sm="6" md="4">
                    <v-text-field v-model="editedItem.busnoa" label="业务代号"></v-text-field>
                  </v-col>
                    <v-col cols="12" sm="6" md="4">
                    <v-text-field v-model="editedItem.accno" label="账号"></v-text-field>
                  </v-col>
                    <v-col cols="12" sm="6" md="4">
                    <v-text-field v-model="editedItem.ccy" label="币种"></v-text-field>
                  </v-col>
                    <v-col cols="12" sm="6" md="4">
                    <v-text-field v-model="editedItem.amttran" label="交易金额"></v-text-field>
                  </v-col>
                    <v-col cols="12" sm="6" md="4">
                    <v-text-field v-model="editedItem.accenmd" label="记账方式"></v-text-field>
                  </v-col>
                  </v-col>
                   <v-col cols="12" sm="6" md="4">
                    <v-text-field v-model="editedItem.flgsiso" label="表内或表外标志"></v-text-field>
                  </v-col>
                    <v-col cols="12" sm="6" md="4">
                    <v-text-field v-model="editedItem.vouno" label="凭证号"></v-text-field>
                  </v-col>
                    <v-col cols="12" sm="6" md="4">
                    <v-text-field v-model="editedItem.frntseq" label="发起方流水号"></v-text-field>
                  </v-col>
                  </v-col>
                    <v-col cols="12" sm="6" md="4">
                    <v-text-field v-model="editedItem.trncodb" label="发起方交易码"></v-text-field>
                  </v-col>
                  <v-col cols="12" sm="6" md="4">
                    <v-text-field v-model="editedItem.chanel" label="发起方渠道代码"></v-text-field>
                  </v-col>
                  <v-col cols="12" sm="6" md="4">
                    <v-text-field v-model="editedItem.accnoa" label="对方账号"></v-text-field>
                  </v-col>
                  <v-col cols="12" sm="6" md="4">
                    <v-text-field v-model="editedItem.brcoter" label="对方行号"></v-text-field>
                  </v-col>
                  <v-col cols="12" sm="6" md="4">
                    <v-text-field v-model="editedItem.ccyopp" label="对方币种"></v-text-field>
                  </v-col>
                </v-row>
              </v-container>
            </v-card-text>

            <v-card-actions>
              <v-spacer></v-spacer>
              <v-btn color="blue darken-1" text @click="close">取消</v-btn>
              <v-btn color="blue darken-1" text @click="save">保存</v-btn>
            </v-card-actions>
          </v-card>
        </v-dialog>
      </v-toolbar>
    </template>
    <template v-slot:item.actions="{ item }">
      <v-icon small class="mr-2" @click="editItem(item)">mdi-pencil</v-icon>
      <v-icon small @click="deleteItem(item)">mdi-delete</v-icon>
    </template>
    <template v-slot:no-data>
      <v-btn color="primary" @click="initialize">Reset</v-btn>
    </template>
  </v-data-table>
</template>

<script>
export default {
  data: () => ({
    thisSerseqn:'',
    chnelnoItems:[],
    moduleItems:[],
    flgtimItems:[],
    dialog: false,
    brcItems:[],
    headers: [
      {
        text: "流水号",
        align: "start",
        value: "serseqn"
         ,width:150
      },
      { text: "法人行号"       , value:  "subbnkn"  ,width:150 },
      { text: "会计日期"       , value:  "datacc"   ,width:150 },
      { text: "交易日期"       , value:  "datetrn"  ,width:150 },
      { text: "交易码"         , value:  "trancode" ,width:150 },
      { text: "序号"           , value:  "seq"      ,width:150 },
      { text: "交易机构"       , value:  "brctran"  ,width:150 },
      { text: "核算机构"       , value:  "brcprf"   ,width:150 },
      { text: "科目号"         , value:  "subno"    ,width:150 },
      { text: "业务代号"       , value:  "busnoa"   ,width:150 },
      { text: "内部账顺序号"   , value:  "sernob"   ,width:150 },
      { text: "账号"           , value:  "accno"    ,width:150 },
      { text: "客户号"         , value:  "custid"   ,width:150 },
      { text: "产品账号"       , value:  "accsub"   ,width:150 },
      { text: "业务场景"       , value:  "scene"    ,width:150 },
      { text: "所属系统"       , value:  "subplat"  ,width:150 },
      { text: "币种"           , value:  "ccy"      ,width:150 },
      { text: "借贷标志"       , value:  "flgdc"    ,width:150 },
      { text: "记账方式"       , value:  "accenmd"  ,width:150 },
      { text: "交易金额"       , value:  "amttran"  ,width:150 },
      { text: "产品代码"       , value:  "prdcode"  ,width:150 },
      { text: "钞汇标志"       , value:  "flgcr"    ,width:150 },
      { text: "表内或表外标志" , value:  "flgsiso"  ,width:150 },
      { text: "科目类别"       , value:  "typacc"   ,width:150 },
      { text: "凭证号"         , value:  "vouno"    ,width:150 },
      { text: "凭证种类"       , value:  "voutyp"   ,width:150 },
      { text: "借据编号"       , value:  "debtno"   ,width:150 },
      { text: "现金项目代码"   , value:  "cashid"   ,width:150 },
      { text: "现转标志"       , value:  "flgct"    ,width:150 },
      { text: "发起方交易日期" , value:  "frntdat"  ,width:150 },
      { text: "发起方流水号"   , value:  "frntseq"  ,width:150 },
      { text: "发起方交易码"   , value:  "trncodb"  ,width:150 },
      { text: "发起方渠道代码" , value:  "chanel"   ,width:150 },
      { text: "是否允许冲销"   , value:  "isclsal"  ,width:150 },
      { text: "流水账类型"     , value:  "stantyp"  ,width:150 },
      { text: "被冲销标志"     , value:  "flgcanl"  ,width:150 },
      { text: "冲销流水号"     , value:  "seqnor"   ,width:150 },
      { text: "摘要"           , value:  "memo"     ,width:150 },
      { text: "摘要码"         , value:  "memono"   ,width:150 },
      { text: "交易柜员"       , value:  "teltran"  ,width:150 },
      { text: "授权柜员"       , value:  "telauth"  ,width:150 },
      { text: "入账标志"       , value:  "flginac"  ,width:150 },
      { text: "交易时间"       , value:  "timtra"   ,width:150 },
      { text: "对方账号"       , value:  "accnoa"   ,width:150 },
      { text: "对方户名"       , value:  "accnama"  ,width:150 },
      { text: "对方行号"       , value:  "brcoter"  ,width:150 },
      { text: "对方行名"       , value:  "brcbcdb"  ,width:150 },
      { text: "对方币种"       , value:  "ccyopp"   ,width:150 },
      { text: "对方钞汇标识"   , value:  "flgcrt"   ,width:150 },
      { text: "特殊清算标志"   , value:  "flgclrs"  ,width:150 },
      { text: "特殊处理标志"   , value:  "flgdeals" ,width:150 },
      { text: "清算传票标志"   , value:  "qscpbz"   ,width:150 },
      { text: "主机交易日期"   , value:  "trandate" ,width:150 },
      { text: "主机流水号"     , value:  "transeq"  ,width:150 },
      { text: "所属模块"       , value:  "module"   ,width:150 },
      { text: "操作", value: "actions", sortable: false ,width:150  }
    ],
    desserts: [],
    editedIndex: -1,
    editedItem: {
      serseqn: "",
      datetrn:"",
      datacc:"",
      brctran:"",
      trancode: "",
      chnelno:"",
      module: "",
      accno: "",
    
    },
    defaultItem: {
      serseqn: "",
      datetrn:"",
      datacc:"",
      brctran:"",
      trancode: "",
      chnelno:"",
      module: "",
      accno: "",
    }
  }),

  computed: {
    formTitle() {
      return this.editedIndex === -1 ? "新增" : "修改";
    }
  },

  watch: {
    dialog(val) {
      val || this.close();
    }
  },

  created() {
    this.initialize();
    this.getDict();
  },

  methods: {
    initialize() {
     this.axios
        .get("/acaccdetail/list")
        .then(response => {
          this.desserts = response.data.data;
        })
        .catch(response => {
          console.log(response.data.message);
        });
    },
     getDict(){
        this.axios
        .get("/dict/topName/渠道")
        .then(response => {
          this.chnelnoItems = response.data.data;
        })
        .catch(response => {
          console.log(response.data.message);
        });
        this.axios
        .get("/dict/topName/交易模块")
        .then(response => {
          this.moduleItems = response.data.data;
        })
        .catch(response => {
          console.log(response.data.message);
        });
        this.axios
        .get("/dict/topName/定时实时标志")
        .then(response => {
          this.flgtimItems = response.data.data;
        })
        .catch(response => {
          console.log(response.data.message);
        });

        this.axios
       .get("/brcInfo/list")
        .then(response => {
          this.brcItems = response.data.data;
        })
        .catch(response => {
          console.log(response.data.message);
        });
      
      
        
    },
    editItem(item) {
      this.editedIndex = this.desserts.indexOf(item);
      this.editedItem = Object.assign({}, item);
      this.dialog = true;
    },

    

    deleteItem(item) {
      const index = this.desserts.indexOf(item);
      confirm("确定要删除此条记录吗?") &&
        this.axios.delete('/acaccdetail/'+item.id)
          .then(res=>{
            this.desserts.splice(index, 1); 
          })
        
    },

    close() {
      this.dialog = false;
      this.$nextTick(() => {
        this.editedItem = Object.assign({}, this.defaultItem);
        this.editedIndex = -1;
      });
    },

    save() {
       this.axios.post("/acaccdetail", this.$qs.stringify(this.editedItem)).then(res => {
          this.initialize();
          this.close();
      });
      
    }
  }
};
</script>